<!DOCTYPE html>
<html class="ui-mobile">
    <head>
        <meta charset="utf-8" />
        <link rel="stylesheet"  href="css/jquery.mobile-1.3.0-rc.1.css">
        <link rel="stylesheet"  href="css/jqm-demos.css">
        
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
        <script type="text/javascript" charset="utf-8" src="telephonenumber.js"></script>
        <script src="js/jquery-1.7.1.min.js"></script>
		<script src="js//jquery.mobile-1.3.0-rc.1.js"></script>
        <script type="text/javascript">
        var telephoneNumber =cordova.require("cordova/plugin/telephonenumber");

        telephoneNumber.get(function(result){

        	//PhoneNumber = result;
        	//console.log(PhoneNumber);

        }, function(error) {

            alert('Error : ' + error);

        });
        </script>
        <title>Hello World</title>
    </head>
    <body class="ui-mobile-viewport ui-overlay-c">
      <h2 id="list-split">Split buttons</h2>
			<p>To make a split list item, simply add a second link inside the <code>li</code>. To adjust the split button icon, add the <code>data-split-icon</code> attribute to the listview . Add the <code>data-icon</code> attribute to individual list items for more control. The theme swatch color of the split button defaults to "b" (blue in the default theme) but can be set by specifying a swatch letter with the <code>data-split-theme</code> attribute at the listview level or for individual splits with the <code>data-theme</code> attribute at the link level.</p>
			<div class="jqm-demos ui-page ui-body-c ui-page-panel ui-page-active">
				<div class="ui-panel-content-wrap ui-body-c ui-panel-animate ui-panel-content-wrap-closed">
					<div data-demo-html="true">
				<ul data-role="listview" data-split-icon="gear" data-split-theme="d" data-inset="true">
					<li><a href="#">
						<img src="../../_assets/img/album-bb.jpg" />
						<h2>Broken Bells</h2>
						<p>Broken Bells</p></a>
						<a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Purchase album</a>
					</li>
					<li><a href="#">
						<img src="../../_assets/img/album-hc.jpg" />
						<h2>Warning</h2>
						<p>Hot Chip</p></a>
						<a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Purchase album</a>
					</li>
					<li><a href="#">
						<img src="../../_assets/img/album-p.jpg" />
						<h2>Wolfgang Amadeus Phoenix</h2>
						<p>Phoenix</p></a>
						<a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Purchase album</a>
					</li>
				</ul>

				<div data-role="popup" id="purchase" data-theme="d" data-overlay-theme="b" class="ui-content" style="max-width:340px; padding-bottom:2em;">
					<h3>Purchase Album?</h3>
					<p>Your download will begin immediately on your mobile device when you purchase.</p>
					<a href="index.html" data-role="button" data-rel="back" data-theme="b" data-icon="check" data-inline="true" data-mini="true">Buy: $10.99</a>
					<a href="index.html" data-role="button" data-rel="back" data-inline="true" data-mini="true">Cancel</a>	
				</div>
			</div>
				
				</div>
			
			
			
			
			
			 </div>
			
        
    </body>
</html>
